<template>
    <view class="ad" v-if="isShowAd">
        <uni-icons custom-prefix="iconfont" type="icon-zengjia1" size="12" class="image" @tap="onBindtapCloseAd"></uni-icons>
		<swiper
            :indicator-dots="indicatorDots"
            :autoplay="autoplay"
            :circular="circular"
            :vertical="vertical"
            :interval="interval"
            :duration="duration"
            :previous-margin="previousMargin + 'rpx'"
            :next-margin="nextMargin + 'rpx'"
        >
            <template v-for="(item, index) in swiperList">
                <swiper-item :key="item.advertId">
                    <image mode="scaleToFill" :src="item" lazy-load style="width: 100%; height: 100%"></image>
                </swiper-item>
            </template>
        </swiper>
    </view>
</template>

<script>
export default {
    data() {
        return {
            advertList: [],
            // 广告列表
            isShowAd: true,
            // 是否显示广告位
            /* 轮播图 */
            swiperList: [],
            indicatorDots: true,
            //指示点
            vertical: false,
            //竖向
            autoplay: true,
            //自动播放
            circular: true,
            //衔接滚动
            interval: 5000,
            //自动切换时间间隔
            duration: 500,
            //滑动动画时长
            previousMargin: 0,
            //前边距，可用于露出前一项的一小部分，接受 px 和 rpx 值
            nextMargin: 0 //后边距，可用于露出后一项的一小部分，接受 px 和 rpx 值
            /* 轮播图 end */
        };
    },
    props: {},
    beforeMount: function () {
        this.getAdvertSpaceList();
    },
    methods: {
        /** ================================ 广告 ==================================== */
        getAdvertSpaceList() {
            getApp().globalData.api.getAdvertSpaceList((result) => {
                console.log('广告：', result);
                let swiperList = [];
                result.forEach((item) => {
                    if (item.spaceName === '首页广告位') {
                        for (let i = 0; i < item.advertList.length; i++) {
                            const pro = item.advertList[i];
                            swiperList.push(pro.url);
                        }
                    }
                });
				this.advertList = result
				this.swiperList = swiperList
            });
        },
        // 关闭广告
        onBindtapCloseAd() {
            this.isShowAd = false
        }
    }
};
</script>
<style>
.ad {
    position: relative;
    margin: 0 20rpx;
}

.image {
    width: 22rpx;
    height: 22rpx;
    position: absolute;
    z-index: 9;
    bottom: 0;
    right: 0;
}
</style>
